<!-- html -->
<div id="BankCardManagement" class="container">
    <!-- html -->
    <div class="personal-wrapper  mt-4 mb-4">
        <div class="container ">
            <div class="row">
                <div class="col-3">
                    <ul class="left-content">
                        <li><a href="#one">投资项</a>
                        </li>
                        <li><a href="#two">借款项目</a> </li>
                        <ul class="subnav">
                            <li><a href="#Loanproject">借款项目</a></li>
                            <li><a href="#">还款明细</a></li>
                        </ul>

                        <li> <a href="#three">我的账户 </a> </li>
                        <ul class="subnav">
                            <li><a href="#accountinformation">账户信息</a></li>
                            <li><a href="#">实名认证</a></li>
                            <li><a href="#BankCardManagement">银行卡管理</a></li>
                            <li><a href="#">登录记录</a></li>
                        </ul>

                        <li><a href="#four">资产详情</a> </li>
                        <ul class="subnav">
                            <li><a href="#">账户流水</a></li>
                            <li><a href="#rechargeRecord">充值记录</a></li>
                            <li><a href="#">提现记录</a></li>
                            <li><a href="#">收款明细</a></li>
                        </ul>

                        <li><a href="#four">个人资料</a>
                        </li>
                    </ul>
                </div>
                <div class="col-8 right-content ">
                    <p>
                        <button class="btn btn-primary" id="NewBankCard" data-toggle="modal"
                            data-target="#myModal">新增银行卡</button>
                    </p>
                    <!-- <ul class="row Bank-car-management">
                        <li class="col-sm clone">
                            <p>银行: <span class="bank">中国银行</span></p>
                            <p>银行支行: <span class="sub-branch ">天府新谷</span></p>
                            <p>银行卡号: <span class="credit-card-numbers">3333333333</span></p>
                        </li>
                        <li class="col-sm clone">
                            <p>银行: <span class="bank">中国银行</span></p>
                            <p>银行支行: <span class="sub-branch ">天府新谷</span></p>
                            <p>银行卡号: <span class="credit-card-numbers">3333333333</span></p>
                        </li>
                    </ul> -->

                    <div class="row" id="cardList">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 模态框 -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
        aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">绑定银行卡</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body">
                    <p>银行名称：<input id="bankName" type="text" class="form-control"> </p>
                    <p>开户行支行名称:<input id="branchName" type="text" class="form-control"></p>
                    <p>银行卡号:<input id="cardNumber" type="text" class="form-control"></p>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                    <button id="saveBtn" type="button" class="btn btn-primary">立即绑定</button>
                </div>
            </div>
        </div>
    </div>
    <!-- 个性css -->
    <link rel="stylesheet" href="../../dist/css/Bankcardmanagement.min.css">

    <script src="../../js/Bankcardmanagement.js"></script>
</div>